<!DOCTYPE html>
<html
  layout:decorator="components/layout"
  xmlns="http://www.w3.org/1999/xhtml"
  xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
>
<head>
  <title>
    备案同步管局文件管理</title>
</head>
<body>
<div
  layout:fragment="content"
  id="app" v-cloak
>
  <div>
    <div class="container">

      <div class="myHeader">
        <div class="myHeader-title">
          备案同步管局文件管理
        </div>
      </div>

      <el-row>
        <el-form label-width="80px">
          <el-col :span="3">
            <el-form-item label-width="0px">
              <el-button type="primary" icon="el-icon-search" size="mini" @click="toggle">高级搜索</el-button>
            </el-form-item>
          </el-col>
          <el-col :span="2">
            <el-form-item label-width="0px">
              <el-button
                type="primary"
                size="mini"
                @click="batchDownload"
                v-realm="'network-configuration:net-communication-log'"
              >数据下载
              </el-button>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="文件类型:">
              <el-select v-model="form.fileType" @change="searchPage" placeholder="请选择" size="mini" clearable>
                <el-option v-for="[key,val] in fileTypeMap" :key="key" :label="val" :value="key">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="通讯类型:">
              <el-select v-model="form.communicateType" @change="searchPage" placeholder="请选择" size="mini" clearable>
                <el-option v-for="[key,val] in communicateTypeMap" :key="key" :label="val" :value="key">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-form>


      </el-row>

      <my-table
        :data="page.records"
        :columns="columns"
        @handle-selection-change="selection"
        @handle-sort-change="sortChange"
      >
        <template #operating="row">
          <el-button
            size="mini"
            type="danger"
            @click.stop.prevent="deleteOne(row.row)"
            v-realm="'network-configuration:net-communication-log:edit'"
          >移除
          </el-button>
        </template>
      </my-table>
      <div class="pagination">
        <el-pagination
          background
          @size-change="changeSize"
          @current-change="goto"
          :current-page="page.current"
          :page-sizes="[10, 20, 30]"
          :page-size="page.size"
          layout="total, sizes, prev, pager, next, jumper"
          :total="page.total"
        >
        </el-pagination>
        <div class="pagination-tool">
          <el-button
            type="danger"
            size="mini"
            @click="deleteSelected"
            v-realm="'network-configuration:net-communication-log:edit'"
          >批量删除
          </el-button>
        </div>
      </div>

    </div>
  </div>
</div>
<div layout:fragment="js">
  <script src="/static/js/module/network-config/api/netCommunicationLogApi.js"></script>
  <script src="/static/js/common/general/axiosDownloadUtils.js"></script>
  <script src="/static/js/module/network-config/admin_api_submit.js"></script>
</div>
</body>
</html>
